// const xhr = new XMLHttpRequest()
// xhr.open('GET', 'http://localhost:9999/ul1')
// xhr.onload = function () {
//   const res = JSON.parse(xhr.responseText)
//   console.log(res)
// }
// xhr.send()
let firstNav, secondNav
init()

function init() {
  setUl()
  setUl2()
}

function setUl() {
  firstNav = document.querySelector(".first-nav")
  ajax({
    url: 'http://localhost:9999/ul1',
    method: 'GET',
    dataType: 'json',
    success(res) {
      // console.log(res.data.category[0])
      let str = '<div><a href="./list.html" data-id="*">全部</a></div>'
      for (let i = 0; i < res.data.category.length; i++) {
        // console.log(res.data.category[i])
        str += `<li><a href="./list.html" data-id="${res.data.category[i].id}" data-name="${res.data.category[i].name}" data-pic="${res.data.category[i].pic}" data-url="${res.data.category[i].url}">${res.data.category[i].name}</a>
        <div class="second-nav"></div>
        </li>`

      }
      firstNav.innerHTML = str
      document.querySelector(".first-nav>div>a").addEventListener("click",clicklist)
      // document.querySelectorALl(".first-nav>li>a").addEventListener("click",clicklist2)
      document.querySelectorAll(".first-nav>li>a").forEach(item=>{
        item.addEventListener("click",(a)=>{
          window.sessionStorage.setItem('listId', a.target.dataset.url.split("=")[1].split("&")[0])
        })
      })
    }
  })
}


function setUl2() {
  document.querySelector(".first-nav").addEventListener("mouseover",mouseoverHand)
}
function mouseoverHand(e){

  let id1=e.target.dataset.id
  ajax({
    url: 'http://localhost:9999/ul2',
    method: 'GET',
    data: { type:'pc_index_category',id:id1 },
    dataType: 'json',
    success (res) {
      let str=""
      for(let i=0;i<res.data.secondary.length;i++){
        str+=`<div><img src="${res.data.secondary[i].pic}"><a  href="./list.html">${res.data.secondary[i].name}</a></div>`
      }
      e.target.parentElement.querySelector(".second-nav").innerHTML=str
      document.querySelectorAll(".second-nav>div>a").forEach(item=>{
        item.addEventListener("click",(a)=>{
          window.sessionStorage.setItem('listId', a.target.innerHTML)
        })
      })
    }
  })
}
